CSS Color Mix #1109
Merged
CSS Color Mix #1109
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
🦋 Changeset detectedLatest commit: fded1fd The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
force-pushed
the
css-transparent-color
branch
from
fa8dc0d to
870011c
Compare
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
force-pushed
the
css-transparent-color
branch
from
1675c7a to
d0cd5a3
Compare
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
force-pushed
the
css-transparent-color
branch
from
d0cd5a3 to
6b10c12
Compare
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
force-pushed
the
css-transparent-color
branch
from
6e05b6f to
62a3635
Compare
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
force-pushed
the
css-transparent-color
branch
from
4a21c59 to
0141cef
Compare
lukasoppermann
temporarily deployed
to
github-pages
GitHub Actions
Inactive
lukasoppermann
force-pushed
the
css-transparent-color
branch
from
0141cef to
fded1fd
Compare
Merged
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
This transformer allows us to use css variables in our output even when we change the alpha value of our tokens.
--[token-name]: #0000008C--[token-name]: color-mix(in srgb, var(--[refernces-token]), 45% transparent)var(--[refernces-token])Impact
Any reference that is in the css of github.com can easily be overwritten by user settings. Keeping references allows us to let users change role colors, e.g. the color for
successand it gets inherited in all places where this is used, even if it is used within another token.Risk
Our support matrix includes Safari 16.0 and 16.1 which do not support
color-mix.If by the time this is released, we still have to support them (it is already a very small amount), we can use an
@supportsblock. However, this would increase our css file size.